<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2022/2/25
  Time: 10:43
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <script>
        window.onload=function (){
            var btn = document.getElementById("btn");
            btn.onclick=function (){
                //第一步用来创建一下XmlHttpRequest对象：
                let xmlHttpRequest = new XMLHttpRequest();
                //第二步发送请求
                xmlHttpRequest.open("GET","ServletDemo01?username=张三",true);
                xmlHttpRequest.send();
                //第三步，接受服务器端响应信息；
                // 选取方式：获取字符串的格式响应信息
                //什么情况下我判断服务器响应的数据完全返回；
                xmlHttpRequest.onreadystatechange=function (){
                    //状态为四的时候是响应结束，http状态码为200的时候，表示响应成功
                    if(xmlHttpRequest.readyState==4&&xmlHttpRequest.status==200){
                        let responseText = xmlHttpRequest.responseText;
                        var user=document.getElementById("username")
                        alert(user);
                        user.innerHTML=responseText;
                    }
                }
            }
        };
    </script>
</head>
<body>
<input type="text" name="username" id="username">
<input type="button" id="btn" value="发送异步请求">
</body>
</html>


